<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
  <base href="/">
  <meta charset="utf-8">
  <title>博客后台管理系统</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
</head>
<body>
<shiro:user>
  <div class="layui-fluid">
    <div class="layui-card">
      <div class="layui-card-header layuiadmin-card-header-auto">
        <shiro:hasPermission name="sys:pl:save"><button class="layui-btn layuiadmin-btn-tags" data-type="add">添加</button></shiro:hasPermission>
      </div>
      <div class="layui-card-body">
        <table id="LAY-user-back-role " class="demo" lay-filter="LAY-user-back-role"></table>
        <shiro:hasPermission name="sys:fl:update"><script type="text/html" id="layuiadmin-app-cont-update">
          <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
        </script></shiro:hasPermission>
          <shiro:hasPermission name="sys:fl:delete"><script type="text/html" id="layuiadmin-app-cont-tagsbar">
          <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
        </script></shiro:hasPermission>
      </div>
    </div>
  </div>
  </shiro:user>
  <shiro:guest>
    <footer th:replace="admin/nologin::header-fragment">
    </footer>
  </shiro:guest>
  <script src="/layuiadmin/layui/layui.js"></script>
  <script>
  layui.config({
    base: '/layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'contlist', 'table','laypage'], function(){

    var table = layui.table;
    var laypage = layui.laypage;
    table.render({
      elem: '.demo'
      ,url: 'admin/AllClassify',
            page: true //开启分页
      ,cols: [
        [
          {field:'classifyId', width:80,align:'center', title: '分类ID',unresize:true}
          ,{field:'classifyName', width:120, align:'center',title: '分类名称',unresize:true}
          ,{field:'classifyCreateTime', width:700, align:'center',unresize:true,templet: "<div>{{layui.util.toDateString(d.classifyCreateTime, 'yyyy-MM-dd HH:mm:ss')}}</div>",title: '分类创建时间'}
          ,{fixed: 'right', title:'操作',align:'center',unresize:true, toolbar: '#layuiadmin-app-cont-update',width: 90}
          ,{fixed: 'right', title:'操作',align:'center',unresize:true, toolbar: '#layuiadmin-app-cont-tagsbar',width: 90}
        ]
      ]
      ,limits: [5,10,20,50]  //每页条数的选择项，默认：[10,20,30,40,50,60,70,80,90]。
      ,limit: 5 //每页默认显示的数量
      ,parseData: function(res) { //res 即为原始返回的数据
        return {
          "code": 0, //解析接口状态
          "msg": "", //解析提示文本
          "count": res.count,
          data: res.data.records //解析数据列表
        };
        alert( res.data.dd)
      }
    });
    //执行一个laypage实例
    laypage.render({
      elem: 'test1' //注意，这里的 test1 是 ID，不用加 # 号
      ,count: 50 //数据总数，从服务端得到
    });
    var $ = layui.$, active = {
      add: function(){
        layer.open({
          type: 2
          ,title: '添加分类'
          ,content: 'admin/tagsform'
          ,area: ['450px', '200px']
          ,btn: ['确定', '取消']
          ,yes: function(index, layero){
            var othis = layero.find('iframe').contents().find("#layuiadmin-app-form-tags")
            ,tags = othis.find('input[name="tags"]').val();
            //请求接口
            $.post('admin/addClassify',{
             "tags":tags
            },function (res){
              if (res.success){
                layer.msg('添加分类成功', {
                  offset: '15px'
                  ,icon: 1
                  ,time: 1000
                });
              }else {
                layer.msg('添加分类失败', {
                  offset: '15px'
                  ,icon: 1
                  ,time: 1000
                });
              }
            },'json');
            if(!tags.replace(/\s/g, '')) return;

            table.reload('LAY-user-back-role');
            layer.close(index);
          }
        });
      }
    }
    $('.layui-btn.layuiadmin-btn-tags').on('click', function(){
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });
    //监听行工具栏
    table.on('tool(LAY-user-back-role)',function (obj) {
      //获取行数据
      var data = obj.data;
      //点击删除
      if (obj.event === 'del'){
        layer.confirm('确定删除吗？', function(index){
          $.ajax({
            url:'admin/deleteClassify',
            data:{"classifyId":data.classifyId},
            dataType:'json',
            method:'post',
            success:function (res) {
              if (res.success){
                layer.msg('删除成功', {
                  offset: '15px'
                  ,icon: 1
                  ,time: 1000
                });
              }else {
                layer.msg('删除失败', {
                  offset: '15px'
                  ,icon: 1
                  ,time: 1000
                });
              }
              table.reload('LAY-user-manage');
            }
            ,error: function(){
              layer.alert('系统错误，请联系管理员！', {
                icon: 2,
                skin: 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
              });
            }
          });
          layer.close(index);
        });
        //删除方法
      } else if (obj.event === 'edit'){
        //点击编辑
        layer.open({
          //打开子窗口
          type: 2
          ,title: '编辑分类',
          data:data
          ,content: 'admin/editagsform'
          ,area: ['450px', '200px'],
          btn: ['确定', '取消']  ,
          success:function (layero, index) {
            //打开子窗口后通过success赋值,两个变量基本是固定写法
            var body = layer.getChildFrame('body', index);
            var iframeWin = window[layero.find('iframe')[0]['name']];
            //给子窗口中的元素赋值
            body.find('input[name="tagss"]').val(data.classifyName);
          },yes: function(index, layero){
            //模板自带,固定写法,要注意子窗口中的提交按钮id对应submitID
            var iframeWindow = window['layui-layer-iframe'+ index]//得到iframe页的窗口对象，执行iframe页的方法：
                    ,submitID = 'LAY-user-front-submit'
                    ,submit = layero.find('iframe').contents().find('#'+ submitID);
            var body = layer.getChildFrame('body', index);
            var tagss = body.find('input[name="tagss"]').val()
            //监听提交
            iframeWindow.layui.form.on('submit('+ submitID +')', function(obj){
              $.ajax({
                url:'admin/updateClassify1',
                data:{"classifyId":data.classifyId,"tags":tagss},
                dataType:'json',
                method:'post',
                success:function (res) {
                  if (res.success){
                    layer.msg('修改分类成功', {
                      offset: '15px'
                      ,icon: 1
                      ,time: 1000
                    });
                  }else {
                    layer.msg('修改分类失败', {
                      offset: '15px'
                      ,icon: 1
                      ,time: 1000
                    });
                  }
                  table.reload('LAY-user-manage');
                }
                ,error: function(){
                  layer.alert('系统错误，请联系管理员！', {
                    icon: 2,
                    skin: 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
                  });
                }
              });
              layer.close(index); //关闭弹层
            });
            submit.trigger('click');
          }
        });
      }
    })
  });
  </script>
</body>
</html>
